<template>
    <el-dialog class="abow_dialog" :close-on-click-modal="false" width="1200px" v-model="visible" @close="handleClose"
        title="审批">
        <div style="margin-bottom: 20px;">
            <div class="xinxi" style="margin-right: 50px; width: 40%;">
                <div class="title">
                    提现人信息</div>
                <div>提现人姓名：{{ tableDatas?.transfer_realname }}</div>
                <div>提现人联系电话：{{ tableDatas?.transfer_mobile }}</div>
                <div>提现金额：￥{{ tableDatas?.apply_money }}</div>
                <div>提现时间：{{ tableDatas?.create_time }}</div>
            </div>
        </div>
        <div style="margin-bottom: 20px;">
            <div class="xinxi" style="margin-right: 50px; width: 40%;">
                <div class="title">
                    审批人信息</div>
                <div>订单编号：{{ tableDatas?.cash_out_no }}</div>
                <div style="display: flex; align-items: center;margin-top: 10px;">
                    <div>审批结果：</div>
                    <el-select v-model="values" placeholder="请选择" style="width: 240px" v-if="detaFlage == 0">
                        <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
                    </el-select>
                    <div v-else>{{ tableDatas?.status_name }}</div>
                </div>
                <div style="display: flex; align-items: center; margin-top: 10px;" v-if="values == 'refuse'">
                    <div>拒绝理由：</div>
                    <el-input v-if="detaFlage == 0" v-model="textarea" style="width: 240px" :rows="2" type="textarea"
                        placeholder="请输入拒绝理由" />
                    <div v-if="detaFlage == 1 && tableDatas?.status == -1">{{
                        tableDatas?.refuse_reason ? tableDatas?.refuse_reason:'无' }}</div>
                </div>
            </div>
        </div>



        <template #footer v-if="detaFlage == 0">
            <el-button @click="handleClose">取消</el-button>
            <el-button type="primary" @click="handleSave"> 确定 </el-button>
        </template>
    </el-dialog>
</template>
<script setup>
import { watch, ref, reactive, nextTick,computed } from 'vue'
import createAxios from '/@/utils/axios'
import { ElMessage } from 'element-plus'
import { log } from '/@/api/backend/routine/AdminInfo'

const props = defineProps({
    modelValue: Boolean,
    data: Object,
    cateid: Number,
    detaFlage: Number
})
let videoUrl = ref('https://cdn.jsdelivr.net/gh/themusecatcher/resources@0.0.3/Bao.mp4')
let visible = ref(false)
let form = ref({}) // 表单数据
let formRef = ref(null) // 表单实例
let loading = ref(false) // 表单加载状态
const values = ref('')

watch(
    () => props.modelValue,
    (val) => {
        visible.value = val;
        if (val) {
            nextTick(() => {
                console.log("props", props.cateid);
                if (props.cateid) {
                    getData(props.cateid);
                }
            });
        }
    },
    { deep: true }
);
let tableDatas = ref()
let fullName = ref()
function getData(cateid) {
    createAxios({ url: '/admin/member.CashOut/info', method: "get", params: { id: cateid } }).then(res => {
        tableDatas.value = res.data
        if (res.data.status == -1 && props.detaFlage == 1) {
            console.log('idddd', tableDatas.value)
            values.value = 'refuse'
        }


    })
}
const emits = defineEmits(['close', 'update'])
const objectSpanMethod = ({ row, column, rowIndex, columnIndex }) => {

}
//关闭操作
const handleClose = () => {
    emits('close', false) // 可以更新 v-model 绑定的值
    values.value = ''
}
const textarea = ref('')
const handleSave = () => {
    if (values.value == '') {
        ElMessage.error('请选择审批结果')
        return
    }
    createAxios({ url: '/admin/member.CashOut/audit', method: "post", params: { id: props.cateid, action: values.value, refuse_reason: textarea.value } }).then(res => {
        emits('close', false) // 可以更新 v-model 绑定的值
        emits('closeSuccess', false) // 可以更新 v-model 绑定的值

        values.value = ''
    })

}

const options = [
    {
        value: 'agree',
        label: '同意',
    },
    {
        value: 'refuse',
        label: '不同意',
    },
]
</script>
<style scoped lang="scss">
.abow_dialog {
    display: flex;
    justify-content: center;
    align-items: Center;
    overflow: hidden;

    .el-dialog {
        margin: 0 auto !important;
        height: 90%;
        overflow: hidden;

        .el-dialog__body {
            position: absolute;
            left: 0;
            top: 54px;
            bottom: 0;
            right: 0;
            padding: 0;
            z-index: 1;
            overflow: hidden;
            overflow-y: auto;
        }
    }
}

.xinxi {
    .title {
        font-size: 17px;

    }
}

.box_s {
    margin-top: 20px;
    display: flex;

    .videos {
        width: 100px;
        height: 100px;
    }
}
</style>
